<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<!DOCTYPE html>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<html lang="zh-cn" style="height: 100%">
<base href="<%=basePath%>">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">

	<title>检查硬件设备</title>
	<link rel="stylesheet" href="css/base.css">
    <style>
        .bluetooth_list p{ position: relative; }
        .bluetooth_list p span,.bluetooth_list p button{
            position: absolute;
            right:0;
            top:0;
            background-color: #999;
            color: #fff;
            border-radius: 5px;
            padding:0 3px;
            border:none;
        }
    </style>
	<script type="text/javascript" src="js/jquery.min.js"></script>
	<!-- <script type="text/javascript" src="js/base64.js"></script> -->
	<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>  
	<script type="text/javascript" src="js/base.js"></script>
	<script type="text/javascript" src="js/common.js"></script>
	<script type="text/javascript" src="js/handle.js"></script>
	<script src="js/jquery.bluetooth.js"></script>  
	
</head>
<body class="">
    <div id="info" style="width:100%"></div>
	<div class="wrap ">
		<div class="query_top">
			<img src="img/query_top.png">
			<h3>
				请先连接蓝牙读取赣通卡再进行
				<span class="check_type"></span>
				！
			</h3>
			<h4 class="query_read" id="query_read">
				读卡
				<span class="check_type"></span>
			</h4>

		</div>
	</div>
	<div class="mask_layer none" >
<!-- 		<div class="query_read_box none"> <i class='query_close'></i>
			<img src="img/query_frame_top.png">
			<h3 class="">
				正在识别蓝牙中
				<br/>
				请勿拔卡或移动卡片
			</h3>
			<p class="">未发现合适蓝牙OBU，更换手机NFC读卡</p>

		</div> -->
		<div class="query_find_blue none"> <i class='query_close'></i>
			<div class="find_blue_top">
				<img src="img/blueTooth.png">
				<h3>正在搜索蓝牙····，请勿关闭OBU</h3>
			</div>
			<div class="bluetooth_list">
				<p>
					<i></i>
					MDZZMDZZMDZZM
				</p>
			</div>
		</div>

	</div>
	<div class="toast toast_timeout" style="display:none">网络异常，请稍后重试！</div>
	<div class="toast toast_error" style="display:none">信息输入有误</div>
	<div class="loading" style="display:none">
		<img src="img/loading.gif">
	</div>
	<script type="text/javascript">
		var fromPage = '${fromPage}';
		$(function () {
            if (fromPage == "recharge") {//来自充值页
                $(".check_type").html("充值");
                // window.location.href = "payment/toRecharge";
            }else if(fromPage == "transfer") {
                $(".check_type").html("圈存");
                // window.location.href = "transfer/toTransfer";
            }
			
			var opts = {
                access_token:'${accessToken}',
                deviceId:'gh_fba483efee4a_d845c3994bdaefc6',//绑定的DeviceId
                openId:'${openId}',                 //后台返回openid
                appId:'${wxconfig.appid}',                  //后台返回appid
                timestamp:'${wxconfig.timestamp}',          //后台返回生成证书时用的时间戳
                nonceStr:'${wxconfig.noncestr}',            //后台返回生成证书时用的随机串
                signature:'${wxconfig.signature}',          //后台返回以当前URL地址生成的证书
            };
            ble = new Ble();
            ble.bleInit(opts);
            var selectId = "";
			//点击读卡 弹出识别蓝牙对话框
			$("#query_read").click(function(e) {
				ble.getWXDeviceInfos();
                ble.scanDevice();
                //10秒后自动停止扫描
                setTimeout(function(){ble.stopScanDevice()},10000);
                $(".query_find_blue, .mask_layer").removeClass('none');
			});

			//识别完成 显示蓝牙列表
			$(".query_read_box h3").click(function(e) {
				$(".query_find_blue, .mask_layer").removeClass('none');
			});

			//点击弹出框右上角X 关闭遮罩层
			$(".query_close").click(function(e) {
				$(".mask_layer, .mask_layer>div").addClass('none');
			});

			// 选择蓝牙盒子 
			$(".bluetooth_list").on("click","p", function(e) {
				// 开始卡片操作 圈存中
                selectId = $(this).attr("id");
                $("#info").append("<p>选择设备"+ selectId +"成功</p>");
			});

			$("#reQuery").click(function(e) {
				$(".query_result").addClass('none');
			});
            $("#next").click(function(e) {
                ble.connectWXDevice(selectId);
            });
            $("#readCard").click(function(e) {
                ble.sendDataInit([
                    "33800fc2010b008009010700a400000210017f",
                    "33800dc20109008007010500b095002bca"
                ]);
                ble.sendDataToWXDevice();
            });
		})
	</script>
 
</body>
</html>